<template>
  <div class="home">
    <van-button type="primary">主要按钮</van-button>
<van-button type="info">信息按钮</van-button>
<van-button type="default">默认按钮</van-button>
<van-button type="warning">警告按钮</van-button>
<van-button type="danger">危险按钮</van-button>
<van-loading />
<van-notice-bar
  left-icon="volume-o"
  text="在代码阅读过程中人们说脏话的频率是衡量代码质量的唯一标准。"
/>
 <p class="title">
             为了引起你的注意，我真是煞费苦心
        </p>
  </div>
</template>

<script>


export default {
  name: 'User'

}
</script>

<style  lang="scss" scoped>
 .title {
                display: block;
                text-decoration: none;
                text-align: center;
                line-height: 1.5;
                margin: 20px 0px;
                background-image: -webkit-linear-gradient(left,#3498db,#f47920 10%,#d71345 20%,#f7acbc 30%,#ffd400 40%,#3498db 50%,#f47920 60%,#d71345 70%,#f7acbc 80%,#ffd400 90%,#3498db);
                color: transparent;
                -webkit-background-clip: text;
                background-size: 200% 100%;
                -webkit-animation: slide 2s infinite linear;
                animation: slide 5s infinite linear;
                font-size: 40px;
            }
            @keyframes slide {
                0%  {
                  background-position: 0 0;
                }
                100% {
                  background-position: -100% 0;
                }
            }
</style>
